<!--
 * @Author: Xujianchen
 * @Date: 2024-12-23 11:12:33
 * @LastEditors: xujianchen
 * @LastEditTime: 2024-12-23 14:37:22
 * @Description: better-scroll scroll 组件
-->
<template>
  <div ref="rootRef">
    <slot />
  </div>
</template>

<script setup>
import useScroll from './useScroll'

const props = defineProps({
  click: {
    type: Boolean,
    default: true,
  },
  // 1. probeType 为 0，在任何时候都不派发 scroll 事件，
  // 2. probeType 为 1，仅仅当手指按在滚动区域上，每隔 momentumLimitTime 毫秒派发一次 scroll 事件，
  // 3. probeType 为 2，仅仅当手指按在滚动区域上，一直派发 scroll 事件，
  // 4. probeType 为 3，任何时候都派发 scroll 事件，包括调用 scrollTo 或者触发 momentum 滚动动画
  probeType: {
    type: Number,
    default: 0,
  },
  options: {
    type: Object,
    default: () => ({}),
  },
})
const emit = defineEmits(['scroll'])

const options = computed(() => {
  const p = props
  return {
    click: p.click,
    probeType: p.probeType,
    ...p.options,
  }
})

const rootRef = ref(null)
const scroll = useScroll(rootRef, options.value, emit)

defineExpose({
  rootRef,
  scroll,
})
</script>
